<template>
  <div class="Category">
    <el-row :gutter="gutterNum">
      <el-col :span="8">
        <el-select v-if="options.GROWTH_CLASSIFY" v-model="ruleForm.GROWTH_CLASSIFY.cateId" :clearable="clearable"
          style="width: 100%;" placeholder="请选择教学对象" :disabled="isDisabled" @change="getStage(true)">
          <el-option v-for="item in options.GROWTH_CLASSIFY" :key="item.cateId" :label="item.itemName" :value="item.cateId" />
        </el-select>
        <el-select v-else v-model="ruleForm.GROWTH_CLASSIFY.cateId" :clearable="clearable" disabled placeholder="请选择">
          <el-option v-for="item in options.STAGE" :key="item.cateId" :label="item.itemName" :value="item.cateId" />
        </el-select>
      </el-col>

      <el-col :span="8">
        <el-select v-if="options.STAGE" v-model="ruleForm.STAGE.cateId" :clearable="clearable" style="width: 100%;"
          placeholder="请选择学段" :disabled="
            !isDisabled && ruleForm.GROWTH_CLASSIFY.cateId ? false : true
          "
          @change="getSubject(true)">
          <el-option v-for="item in options.STAGE" :key="item.cateId" :label="item.itemName" :value="item.cateId" />
        </el-select>
        <el-select v-else v-model="ruleForm.STAGE.cateId" :clearable="clearable" disabled placeholder="请选择">
          <el-option v-for="item in options.STAGE" :key="item.cateId" :label="item.itemName" :value="item.cateId" />
        </el-select>
      </el-col>

      <el-col v-if="options.SUBJECT" :span="8">
        <el-select v-if="options.SUBJECT" v-model="ruleForm.SUBJECT.cateId" :clearable="clearable" style="width: 100%;"
          placeholder="请选择学科" :disabled="!isDisabled && ruleForm.STAGE.cateId ? false : true" @change="(val)=>bizTypeEnum==='PREPARELESSON' ? getCategory(val): callBack(val)">
          <el-option v-for="item in options.SUBJECT" :key="item.cateId" :label="item.itemName" :value="item.cateId" />
        </el-select>

        <el-select v-else v-model="ruleForm.SUBJECT.cateId" :clearable="clearable" disabled placeholder="请选择">
          <el-option v-for="item in options.SUBJECT" :key="item.cateId" :label="item.itemName" :value="item.cateId" />
        </el-select>
      </el-col>
      <el-col v-if="options.SUBJECT&&bizTypeEnum==='PREPARELESSON'&&options.BOOK_VERSION.length" class="marginT20">
        <el-col :span="8">
          <el-select v-model="ruleForm.BOOK_VERSION.cateId" :clearable="clearable" style="width: 100%;" placeholder="请选择版本"
            @change="getCategory">
            <el-option v-for="item in options.BOOK_VERSION" :key="item.cateId" :label="item.itemName" :value="item.cateId" />
          </el-select>
        </el-col>
        <el-col :span="8" v-if="options.GRADE.length">
          <el-select v-model="ruleForm.GRADE.cateId" :clearable="clearable" style="width: 100%;" placeholder="请选择学期"
            @change="getCategory">
            <el-option v-for="item in options.GRADE" :key="item.cateId" :label="item.itemName" :value="item.cateId" />
          </el-select>
        </el-col>
      </el-col>
      <!-- <el-col v-else :span="6">
      <el-select clearable v-model="ruleForm.SUBJECT.cateId" disabled placeholder="请选择">
        <el-option
          v-for="item in options.SUBJECT"
          :key="item.cateId"
          :label="item.itemName"
          :value="item.cateId"
        />
      </el-select>
      </el-col>-->
    </el-row>
  </div>
</template>

<script>
  /** *
 bizTypeEnum: 业务类型
 * */
  import {
    findByParentpCateId
  } from '@/api/basic'
  export default {
    name: 'Category',
    props: ['list', 'bizTypeEnum', 'gutter', 'disabled', 'clearable'],
    data() {
      return {
        gutterNum: this.gutter || 0,
        isDisabled: this.disabled ? this.disabled : false,
        options: {
          GROWTH_CLASSIFY: {
            cateId: '',
            itemCode: '',
            itemName: ''
          },
          STAGE: {
            cateId: '',
            itemCode: '',
            itemName: ''
          },
          SUBJECT: {
            cateId: '',
            itemCode: '',
            itemName: ''
          },
          BOOK_VERSION: {
            cateId: '',
            itemCode: '',
            itemName: ''
          },
          GRADE: {
            cateId: '',
            itemCode: '',
            itemName: ''
          }
        },
        ruleForm: {
          GROWTH_CLASSIFY: this.list.GROWTH_CLASSIFY || {
            cateId: null,
            itemCode: null
          },
          BOOK_VERSION: this.list.BOOK_VERSION || {
            cateId: null,
            itemCode: null
          },
          // BOOK_VERSION:this.list.BOOK_VERSION||{cateId: null, itemCode: null},
          STAGE: this.list.STAGE || {
            cateId: null,
            itemCode: null
          },
          SUBJECT: this.list.SUBJECT || {
            cateId: null,
            itemCode: null
          },
          GRADE: this.list.GRADE || {
            cateId: null,
            itemCode: null
          }
        }
      }
    },
    computed: {},
    watch: {},
    created() {
      console.log('this.list:', this.list)
      this.init()
    },
    methods: {
      async init() {
        // 获取教学对象
        this.getCategory()
      },

      // 获取教学对象
      getCategory(pCateId) {
        findByParentpCateId({
          bizTypeEnum: this.bizTypeEnum,
          pCateId
        }).then(res => {
          const info = res.data
          if (!pCateId) {
            this.options.GROWTH_CLASSIFY = info.categoryVoList
            this.getStage(false)
          } else if (info.groupCode) {
            this.$set(this.options, info.groupCode.toUpperCase(), info.categoryVoList)
            if (info.groupCode) {
              const {
                cateId,
                itemName,
                itemCode
              } = pCateId ? info.categoryVoList[0] : {}
              this.$set(this.ruleForm, info.groupCode.toUpperCase(), cateId)
            }

          }
          this.callBack()
        })
      },

      // 获取学段
      getStage(isChange) {
        findByParentpCateId({
          bizTypeEnum: this.bizTypeEnum,
          pCateId: this.ruleForm.GROWTH_CLASSIFY.cateId
        }).then(res => {
          this.options.STAGE = res.data.categoryVoList
          this.ruleForm.STAGE = !isChange ? this.ruleForm.STAGE : this.defaultData()
          this.getSubject(isChange)
        })
      },

      // 获取学科
      getSubject(isChange) {
        findByParentpCateId({
          bizTypeEnum: this.bizTypeEnum,
          pCateId: this.ruleForm.STAGE.cateId
        }).then(res => {
          this.options.SUBJECT = res.data.categoryVoList
          this.ruleForm.SUBJECT = !isChange ? this.ruleForm.SUBJECT : this.defaultData()
          this.callBack()
        })
      },

      // 更新数据
      update() {
        if (
          this.ruleForm.GROWTH_CLASSIFY &&
          this.ruleForm.GROWTH_CLASSIFY.cateId
        ) {
          var GROWTH_CLASSIFY = this.options.GROWTH_CLASSIFY.filter(
            item => item.cateId === this.ruleForm.GROWTH_CLASSIFY.cateId
          )
          this.list.GROWTH_CLASSIFY = JSON.parse(
            JSON.stringify(GROWTH_CLASSIFY[0])
          )
        } else {
          this.list.GROWTH_CLASSIFY = this.defaultData()
          this.ruleForm.GROWTH_CLASSIFY = this.defaultData()
        }
        if (this.ruleForm.STAGE && this.ruleForm.STAGE.cateId) {
          var STAGE = this.options.STAGE.filter(
            item => item.cateId === this.ruleForm.STAGE.cateId
          )
          this.list.STAGE = JSON.parse(JSON.stringify(STAGE[0]))
        } else {
          this.list.STAGE = this.defaultData()
          this.ruleForm.STAGE = this.defaultData()
        }
        if (this.ruleForm.SUBJECT && this.ruleForm.SUBJECT.cateId) {
          var SUBJECT = this.options.SUBJECT.filter(
            item => item.cateId === this.ruleForm.SUBJECT.cateId
          )
          this.list.SUBJECT = JSON.parse(JSON.stringify(SUBJECT[0]))
        } else {
          this.list.SUBJECT = this.defaultData()
          this.ruleForm.SUBJECT = this.defaultData()
        }

        if (this.ruleForm.BOOK_VERSION && this.ruleForm.BOOK_VERSION.cateId) {
          var BOOK_VERSION = this.options.BOOK_VERSION.filter(
            item => item.cateId === this.ruleForm.BOOK_VERSION.cateId
          )
          this.list.BOOK_VERSION = JSON.parse(JSON.stringify(BOOK_VERSION[0]))
        } else {
          this.list.BOOK_VERSION = this.defaultData()
          this.ruleForm.BOOK_VERSION = this.defaultData()
        }

        if (this.ruleForm.GRADE && this.ruleForm.GRADE.cateId) {
          var GRADE = this.options.GRADE.filter(
            item => item.cateId === this.ruleForm.GRADE.cateId
          )
          this.list.GRADE = JSON.parse(JSON.stringify(GRADE[0]))
        } else {
          this.list.GRADE = this.defaultData()
          this.ruleForm.GRADE = this.defaultData()
        }
      },

      defaultData() {
        return {
          cateId: '',
          itemCode: '',
          itemName: ''
        }
      },

      // 返回数据
      callBack() {
        this.update()
        this.$emit('Callback', this.list)
      }
    }
  }
</script>

<style lang="scss" scoped></style>
